*{
    margin: 0;
    padding:0 ;
}
$width:200px;
$height:30px;
$fontsize:14px;
body{
    background: #fcfafd;
}
/*----------------------head----------------------*/
.load_top{
    padding-left: 11px;
    width: 989px;
    margin: 0 auto;
    height: 60px;
    padding-top: 40px;
}
.load_top{
    li{
        float: left;
    }
    .top_l{
        .top_l1{
            width: $width;
            height: $height*2;
            float: left;
            padding-right: 13px;
            border-right: 1px solid #d2d0d3;
        }
        & .top_l1{
            a{
                display: block;
                width: 100%;
                height: 100%;
                background: url(../scss/img/login/load0518.png) no-repeat -80px -106px;
            }
            & .top_l2{
                line-height: $height*2;
                padding: 0 15px;
                color: #626262;
                font-size: 20px;
            }
        } 
    } 
    & .top_r{
        margin-top: 15px;
    }
    & .top_r{
        li{
            width: $width/2;
            height: $height;
            padding-left: 40px;
            line-height:  $height;
            font-size: $fontsize;
            color: #313131;
            background: url(../scss/img/login/load0518.png) no-repeat
        }
        & .top_r1{
            background-position: -389px -59px;
        }
        & .top_r2{
            background-position: -389px -90px;
        }
        & .top_r3{
            background-position: -389px -121px;
        }
    } 
}  
/*----------------------body--------------------*/
.load_con{
    width: $width*5;
    margin: 50px auto 60px;  
}
.load_con{
    .load_con_pic {
        width: 545px;
        height: 450px;
        padding-left: 10px;
    }
} 

.load_con_reg {
  width: 402px;
  background: url(../scss/img/login/load0518.png) no-repeat 6px -56px;
  padding-left: 34px;
}
.load_con_reg{
    .re_back {
        width: 340px;
        height: 458px;
        padding: 30px 0 0 60px;
        border: 1px solid #d2d0d3;
        background: #fff url(../scss/img/login/load0518.png) no-repeat 0 -469px;
    }
    & .re_back{
        .check_box{
            height: 37px;
            margin-bottom: 25px;
            overflow: hidden;
            width: 100%;
        }
        & .check_box{
            .login_img {
                background-position: -20px -81px;
                cursor: pointer;
                height: 37px;
                width: 37px;
            }
            & .login_img{
                &:hover{
                     background-position: -20px -132px;
                }
            }
            & .login_tip {
                background-position: -15px -14px;
                color: #ff94ae;
                font-size: 12px;
                height: 25px;
                line-height: 24px;
                margin-top: 10px;
                text-align: center;
                width: $width/2;
            }
            & span {
                background: rgba(0, 0, 0, 0) url(../scss/img/login/login_img.png) no-repeat scroll 0 0;
                display: block;
                float: right;
            }
        } 
        & div {
          width: 280px;
          height: 40px;
          position: relative;
          margin-bottom: 24px;
          margin-top: 5px;
        }
        & input {
          width: 248px;
          height: 38px;
          color: #aaa;
          padding: 0 15px;
          font-size: 14px;
          font-family: "songti";
          font-weight: 900;
          border: 1px solid #cfcfd1;
          border-radius: 3px;
          line-height: 38px;
          outline: none;
        }
        & .ok {
          background: url(../scss/img/login/load1101.png) no-repeat -176px -66px;
          width: 17px;
          height: 17px;
          display: block;
          position: absolute;
          right: 14px;
          top: 12px;
          display: none;
        }
    }
} 
.load_con_reg .re_back .wrong {
  color: #f51973;
  padding-right: 20px;
  height: 28px;
  padding-left: 38px;
  width: 120px;
  border: 1px solid #fcb3d1;
  border-radius: 3px;
  line-height: 28px;
  background: #fef1f7 url(../scss/img/login/load0518.png) no-repeat -395px -163px;
  position: absolute;
  left: 0;
  top: -32px;
  z-index: 3;
  display: none;
}
.load_con_reg .re_back .wrong .sanj {
  position: absolute;
  left: 20px;
  top: 28px;
  background: url(../scss/img/login/load0518.png) no-repeat -35px -168px;
  width: 15px;
  height: 8px;
  display: block;
}
.load_con_reg .re_back #choice {
  margin-right: 5px;
  border: 1px solid #cfcfd1;
  display: inline-block;
  vertical-align: middle;
  line-height: 40px;
  margin-top: -2px;
  width: 13px;
  height: 13px;
}
.load_con_reg .re_back .cell {
  margin-bottom: 0;
}
.load_con_reg .re_back .TP {
  color: #F51972;
}
.load_con_reg .re_back #register_btn {
  border: 0;
  font-size: 15px;
  width: 140px;
  height: 40px;
  text-align: center;
  color: #fff;
  cursor: pointer;
  float: left;
  margin-right: 60px;
  background: url(../scss/img/login/load0518.png) no-repeat -34px -64px;
}
#area {
  width: 130px;
  height: 40px;
  position: absolute;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  color: #f51972;
  top: -5px;
  left: 150px;
}
.friend{
    color: #808080;
}
.friend1{
    height: 24px;
    line-height: 24px
}
.friend2{
    margin-top: 5px;
}
.friend2{
    a{
        float: left;
        width: 24px;
        height: 24px;
        margin-right: $height/3;
        background: url(../scss/img/login/load0518.png) no-repeat;
    }
    & .friend_list1{
        background-position: -57px -192px;
    }
    & .friend_list1{
        &:hover{
            background-position: -57px -168px;
        }
    }
    & .friend_list2{
        background-position: -81px -192px;
    }
    & .friend_list2{
        &:hover{
            background-position: -81px -168px;
        } 
    }
    & .friend_list3{
        background-position: -177px -192px;
    }
    & .friend_list3{
        &:hover{
            background-position: -177px -168px;
        }
    }
    & .friend_list4{
        background-position: -105px -192px;
    }
    & .friend_list4{
        &:hover{
           background-position: -105px -168px;
        }
    }   
    & .friend_list5{
        background-position: -129px -192px;
    }
    & .friend_list5{
        &:hover{
            background-position: -129px -168px;
        }
    }
    & .friend_list6{
        background-position: -153px -192px;
    }
    & .friend_list6{
        &:hover{
            background-position: -153px -168px;
        }
    }
}
/*------------------------------footer-------------------------*/
#footer{
  
    .about_us {
        text-align: center;
        height: 24px;
        line-height: 24px;
    }
    & .about_us{
        a{
            color: #898989;
            margin: 0 10px;
        }
        &{
            a{
                &:hover{
                   color: red; 
                }
            }
        }
    }
    & .copyright {
        text-align: center;
        height: 24px;
        line-height: 24px;
        color: #898989;
    }
     
} 
#footer{
    border: none;
    box-shadow: 0 0 0 0;
}
